<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
		<script src="../lib/echarts.min.js"></script>
	</head>
	<body>
		<div style="width: 100%; height: 900px"></div>
		<script>
			var mCharts = echarts.init(document.querySelector('div'))
      // 各个维度的最大值
      var dataMax = [
        {
          name: '易用性',
          max: 100
        },
        {
          name: '功能',
          max: 100
        },
        {
          name: '拍照',
          max: 100
        },
        {
          name: '跑分',
          max: 100
        },
        {
          name: '续航',
          max: 100
        }
      ]
      var option = {
        radar: {
          indicator: dataMax,
          shape: 'polygon' // 配置雷达图最外层的图形展示 circle
        },
        series: [
          {
            type: 'radar', // 此图表是一个雷达图
            label: {
              show: true  // 显示数值
            },
            areaStyle:{}, // 将每个产品的雷达图形成阴影的区域
            data: [
              {
                name: '华为手机',
                value: [80,90,84,90,89]
              },
              {
                name: '中兴手机',
                value: [78,98,80,85,81]
              }
            ]
          }
        ]
      }
      mCharts.setOption(option)
     </script>
	</body>
</html>
